<template>
	<view class="wrap">
		<view class="search"><u-search v-model="keywords" @custom="search" @search="search"></u-search></view>
		<scroll-view class="scroll-list" scroll-y="true" @scrolltolower="loadMore">
			<u-cell-group class="list" :border="false">
				<u-swipe-action v-for="(item, index) in list" :key="item.id" :index="index" @click="optionsClick">
					<u-cell-item :arrow="true" @click="navTo('taskFeedbackDetail?actionId=' + item.id)" style="border-bottom: 1px solid #ededed">
						<text slot="title" class="u-line-1 content-span">{{ item.taskTitle || item.id }}</text>
						<view slot="label" style="padding-bottom:20rpx">任务类型：{{ item.taskTypeName }}</view>
						<view slot="label" style="padding-bottom:20rpx">任务内容：{{ item.taskContent || '无' }}</view>

						<text slot="label">
							<u-button
								type="primary"
								style="margin-top: 25rpx; width: 30%; margin-bottom: 4rpx ;margin-right:10rpx;display: inline-block;    right: -32%;"
								@click="navTo('taskFeedbackDetail?actionId=' + item.id)"
								:plain="true"
								
							>
								去反馈
							</u-button>
							<u-button
								@click="show1(item)"
								type="defult"
								style=" margin-top: 25rpx; width: 30%; margin-bottom: 4rpx ;   right: -30%;display: inline-block;   right: -34%;"
								:plain="true"
								
							>
								申请批示
							</u-button>
						</text>
					</u-cell-item>
				</u-swipe-action>
			</u-cell-group>
			<u-form class="form" :model="param" :rules="rules" ref="uForm" label-position="left">
				<u-modal v-model="show" title="申请批示" @cancel="cancel" @confirm="submitFalse" confirmText="确定" cancelText="取消" :show-cancel-button="true">
					<view class="u-update-content" style="margin: 20rpx 20rpx 0 20rpx">
						<u-form-item label="" prop="explainCode" label-width="180">
							<js-select
								v-model="param.explainCodeStr"
								:items="userSelectList"
								placeholder="请选择人员"
								:tree="true"
								@confirm="LeaderOrg(arguments)"
								:label-value="param.explainName"
								@label-input="param.explainCode = $event"
							></js-select>
							<span class="input-group-addon" v-if="param.explainName != ''" @click="clickX">X</span>
						</u-form-item>
					</view>
					<view class="u-update-content" style="margin: 20rpx 20rpx 0 20rpx">
						<textarea
						  type="text"
						  style="
						    width: 100%;
						    height: 190rpx;
						    font-size: 14px;
						  "
						  v-model="param.explainContent"
						  placeholder-class="line"
						  maxlength="200"
						  placeholder="请输入200字以内的拟办意见"
						/>
					</view>
				</u-modal>
			</u-form>
			<view class="loadmore" @click="loadMore"><u-loadmore :status="loadStatus"></u-loadmore></view>
		</scroll-view>
		<!-- <view class="btn-plus" @click="navTo('taskFeedbackDetail')">
			<u-icon name="plus-circle-fill" size="90" color="#3d87ff"></u-icon>
		</view> -->
	</view>
</template>
<script>
/**
 * Copyright (c) 2013-Now http://jeesite.com All rights reserved.
 */
export default {
	data() {
		return {
			param: {
				isNewRecord: false,
				explainName: '',
				explainCode: '',
				explainContent: ''
			},
			show: false,
			keywords: '',
			query: {
				pageNo: 1,
				pageSize: 20
			},
			userSelectList: [],
			list: [],
			count: 0,
			loadStatus: 'loadmore',
			options: [{ text: '删除', style: { background: '#dd524d' } }],
			rules: {
				explainCode: [
					{
						required: true,
						message: '请选择领导',
						trigger: ['change', 'blur']
					}
				]
			}
		};
	},
	onLoad() {
		this.loadList();
	
	},
	onShow() {
		if (uni.getStorageSync('refreshList') === true) {
			uni.removeStorageSync('refreshList');
			this.search('');
		}
	},
	methods: {
		LeaderOrg(val) {
			this.param.explainCode = val[0];
			this.param.explainName = val[1];
		},
		clickX() {
			this.param.explainCode = '';
			this.param.explainCodeStr = '';
			this.param.explainName = '';
		},
		submitFalse() {
			this.$refs.uForm.validate(valid => {
				if (valid) {
					this.$u.api.taskReceive.instructions(this.param).then(res => {
						uni.showModal({
							title: '提示',
							content: res.message,
							showCancel: false,
							success: function() {
								if (res.result == 'true') {
									uni.setStorageSync('refreshList', true);
									// uni.navigateBack();
								}
							}
						});
						this.param.explainCode = '';
						this.param.explainName = '';
						this.param.explainContent = '';
					});
				} else {
					this.$u.toast('您填写的信息有误，请根据提示修正。');
				}
			});
		},
		cancel() {
			// this.userSelectList=[]
			this.param.explainCode = '';
			this.param.explainName = '';
			this.param.explainContent = '';
		},
		show1(item) {
			this.param.id = item.id;
			this.show = true;
			if(this.userSelectList == null || this.userSelectList == undefined || this.userSelectList.length == 0){
				this.$u.api.getLoginOffice().then(res => {
					this.$u.api.office.treeDataWithMobile({ isLoadUser: true, parentCode: res.employeeOffice.parentCodes }).then(res => {
						this.userSelectList = res;
					});
				});
			}
			this.$refs.uForm.setRules(this.rules);
		},
		loadMore() {
			this.loadStatus = 'loading';
			setTimeout(() => {
				this.query.pageNo += 1;
				this.loadList();
			}, 100);
		},
		loadList() {
			this.query.taskYear = new Date().getFullYear();
			this.$u.api.taskFeedback.list(this.query).then(res => {
				if (!res.list || res.list.length == 0) {
					this.loadStatus = 'nomore';
					return;
				}
				this.list = this.list.concat(res.list);
				this.count = res.count;
				this.query.pageNo = res.pageNo;
				this.query.pageSize = res.pageSize;
				this.loadStatus = 'loadmore';
			});
		},
		optionsClick(rowIndex, btnIndex) {
			if (btnIndex == 0) {
				let self = this;
				uni.showModal({
					title: '提示',
					content: '确认要删除该数据吗？',
					showCancel: true,
					success: function(res2) {
						if (res2.confirm) {
							let row = self.list[rowIndex];
							self.$u.api.testData.delete({ id: row.id }).then(res => {
								self.$u.toast(res.message);
								if (res.result == 'true') {
									self.list.splice(rowIndex, 1);
								}
							});
						}
					}
				});
			}
		},
		search(value) {
			this.query.taskTitle = value;
			this.list = [];
			this.query.pageNo = 0;
			this.loadList();
		},
		navTo(url) {
			uni.navigateTo({
				url: url
			});
		}
	}
};
</script>
<style lang="scss">
page {
	background-color: #f8f8f8;
}
.btn-plus {
	position: absolute;
	bottom: 50rpx;
	right: 50rpx;
	z-index: 1;
	opacity: 0.6;
}
.btn-plus:hover {
	opacity: 1;
}
.u-cell{
	max-width: 400px!important;
}
</style>
